/* eslint-disable no-undef */
(function ($) {
  const _$addModal = $("#modal-create-user");
  const _$addForm = _$addModal.find("form");
  const _$editModal = $("#modal-edit-user");
  const _$editForm = _$editModal.find("form");
  const Toast = Swal.mixin({
    toast: true,
    position: 'top-end',
    showConfirmButton: false,
    timer: 3000
  });

  // 验证器规则
  const vailRule = {
    rules: {
      username: {
        required: true,
      },
      password: {
        required: true,
        minlength: 6
      },
    },
    messages: {
      username: {
        required: "请输入用户名",
      },
      password: {
        required: "请输入密码",
        minlength: "至少输入6位密码"
      },
    },
    errorElement: 'span',
    errorPlacement: function (error, element) {
      error.addClass('invalid-feedback');
      element.closest('.form-group').append(error);
    },
    highlight: function (element) {
      $(element).addClass('is-invalid');
    },
    unhighlight: function (element) {
      $(element).removeClass('is-invalid');
    }
  };

  // 添加验证表单
  _$addForm.validate(vailRule);
  // 添加验证表单
  _$addModal.find("#addUserBtn").on("click", function (e) {
    if (!_$addForm.valid()) {
      return;
    }
    _$addForm.submit();
  });
  // 点击监听添加模态框显示与隐藏
  _$addModal.on('shown.bs.modal', () => {
    _$addForm.find('input:not([type=hidden]):first').focus();
  }).on('hidden.bs.modal', () => {
    _$addForm[0].reset();
  });


  // 编辑验证表单
  _$editForm.validate(vailRule);
  // 提交编辑验证表单
  _$editModal.find("#editUserBtn").on("click", function (e) {
    if (!_$editForm.valid()) {
      return;
    }

    _$editForm.submit();
  });

  // 点击编辑按钮，触发模态框
  $("#userTable").on('click', '.toggle-edit-modal-btn', function (e) {
    e.preventDefault();
    // 获取a标签的url
    let targetUrl = $(this).attr("href");

    $.get(targetUrl, (data) => {
      let {
        username,
        password,
        authority
      } = data;
      $("#inputEditUsername").val(username);
      $("#inputEditPassword").val(password);
      $("#inputEditAuthority").find(`option[value = '${authority}']`).prop('selected', true);
      _$editModal.modal("show");
    });


  });
  // 点击监听编辑模态框显示与隐藏
  _$editModal.on('shown.bs.modal', () => {
    _$editForm.find('input:not([type=hidden]):first').focus();

  }).on('hidden.bs.modal', () => {
    _$editForm[0].reset();
  });

  // 删除按钮
  $("#userTable").on('click', '.delete-confirm-btn', function (e) {
    e.preventDefault();
    let name = $(this).parent().prevAll().eq(2).text();
    // 获取a标签的url
    let targetUrl = $(this).attr("href");
    Swal.fire({
      title: `确定删除工作人员${name}吗?`,
      text: "此操作不可逆,请慎重考虑",
      type: 'warning',
      showCancelButton: true,
      confirmButtonColor: '#3085d6',
      cancelButtonColor: '#dc3545',
      cancelButtonText: '取消',
      confirmButtonText: '确定!'
    }).then((result) => {
      if (result.value) {
        $(location).attr('href', targetUrl);
      }
    });
  });

  let resultStatus = getUrlParam("result");
  if (resultStatus == 1) {
    Toast.fire({
      type: 'success',
      title: '-----删除成功-----',
    });
  } else if (resultStatus == 2) {
    Toast.fire({
      type: 'success',
      title: '-----添加成功-----',
    });
  } else if (resultStatus == 3) {
    Toast.fire({
      type: 'success',
      title: '-----编辑成功-----',
    });
  }
})(jQuery);